<template>
  <div id="modsjoy">
    <div v-if="isMobile">
      <router-view name="m"></router-view>
    </div>
    <div v-else>
      <router-view name="pc"></router-view>
    </div>
  </div>
</template>

<script lang="ts">
import { defineComponent } from 'vue'
// import elementResizeDetectorMaker from 'element-resize-detector'

export default defineComponent({
  name: 'App',
  components: {

  },
  data() {
    return {
      // isMobile: 0
    }
  },
  setup() {
    // 判断是否为手机端
    const isMobile = navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i)
  
    return {
      isMobile
    }
  },
  methods: {
    // isMobile() {
    //   let flag = navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i)
    //   return flag;
    // }
  },

})
</script>

<style>
#app {
  font-family: "Avenir", Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #2c3e50;
  width: 100%;
  height: 100%;
}
* {
  margin: 0;
  padding: 0;
}
html,
body {
  width: 100%;
  height: 100%;
  background: #f4f5f5;
}
ul {
  list-style: none;
}
a {
  text-decoration: none;
}
img {
  vertical-align: top;
  border: none;
}
</style>